<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<canvas id="canvas" width="1024" height="768" style="border:1px solid #aaa;display:block;margin:50 auto;"></canvas>
		
		<script type="text/javascript">
			
			var canvas=document.getElementById("canvas");
			var context=canvas.getContext("2d");
			
			var point1 = { left: 172, top: 276 };//第一个点
			var point2 = { left: 254, top: 236 };//第二个点
			context.beginPath();
			context.moveTo(point1.left, point1.top);//起始位置
			context.lineTo(point2.left, point2.top);//停止位置
			context.stroke();
		</script>
	</body>
</html>
